{% extends "_layout.html" %}
{% import "component/statistics.njk" as statistics %}

{# 样式代码 #}
{% block style %}
<title>选择题目发布</title>
<style type="text/css">
    .mui-content{padding-bottom: 50px;}
    .mui-content>.mui-table-view:first-child{margin: 0;}
    .mui-table-view-cell{ padding: 16px 15px;}
    .mui-table-view-cell>a:not(.mui-btn){margin: -16px -15px;}
</style>
{% endblock %}

{# bodyd代码#}
{% block body %}
<div class="mui-content">
    <!--单选题-->
    {% for item in data.list %}
    <div class="mui-card">
        <div class="mui-card-content">
            <div class="mui-card-content-inner">
                <a href="arrhomework4?id={{item.id}}"><span>[单选题]</span>{{item.content}}
                    <div class="mb-subjects">
                        {%for item2 in item.choiceDTOs%}
                        <p>{{item2.serialNumber}}.{{item2.content}}</p>
                        {%endfor%}
                    </div>
                    <form  class="mui-input-group" action="">
                        <div class="mui-input-row mui-checkbox mb-sub-row">
                            <label class="mb-box">难度 {{item.serialNumber}}</label>
                            <input name="checkbox1" data-id="{{item.id}}" type="checkbox" onclick="js_on(this)">
                        </div>
                    </form>
                </a>
            </div>
        </div>
    </div>
    {%endfor%}
</div>

<!--已选题目数量统计-->
<nav class="mui-bar mui-bar-tab mb-bar-tab1 xw-border-top">
    <a class="mb-selected" href="javascript:void(0);">已选题目（<span id="number">0</span>）</a>
</nav>
{% endblock %}

{#js代码#}
{% block js %}
<script src="js/jquery-2.1.1.min.js"></script>
<script>





    // var arr = [];
    // var arr2 = [];
    //
    // var n = 0;
    //
    // $('.mb-selected').on('click',function(){
    //     console.log(arr);
    //     sessionStorage.setItem('dataid',arr);
    //     sessionStorage.setItem('text',arr2);
    //     console.log(sessionStorage.getItem('dataid'));
    //     console.log(sessionStorage.getItem('text'));
    //     console.log(arr2);
    //     window.location.href = '/selected';
    // });
    // function js_on(e){
    //     let details = $(e).parent('div').parent('form').parent('a').parent('div').parent('div').parent('div').html();
    //     arr2.push(details);
    //     arr.push($(e).data('id'));
    //     $('#number').text(++n);
    //     $(e).attr('onclick','js_off(this)');
    // }
    //
    // function js_off(e){
    //     $('#number').text(--n);
    //     for(let i=0;i<arr.length;i++){
    //         if(arr[i] == $(e).data('id')){
    //             arr.splice(i,1);
    //             break;
    //         }
    //     }
    //     $(e).attr('onclick','js_on(this)');
    // }


</script>
<!--flotdemo-->
{% endblock %}
